<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title>首页</title>
    <link rel="stylesheet" href="../style/swiper.css">
    <link rel="stylesheet" href="../style/index.css">
    <script src="../js/zepto.js"></script>
    <script src="../js/swiper.js"></script>
    <script src="../js/iscroll.js"></script>
    <script src="../js/index.js"></script>
    <script src="../js/cookie.js"></script>
</head>
<body>
<div class="wrapper">
    <!---------------------------------header------------------------------------>
    <header></header>
    <!---------------------------------search------------------------------>
    <div class="search">
        <form>
            <input type="submit" class="iconfont" value="&#x343e;">
            <input type="text" placeholder="请输入搜索内容">
        </form>
    </div>
    <!---------------------------------banner------------------------------>
    <div class="banner">
        <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide"><img src="../images/b1.jpg"></div>
                <div class="swiper-slide"><img src="../images/b2.jpg"></div>
                <div class="swiper-slide"><img src="../images/b3.jpg"></div>
                <div class="swiper-slide"><img src="../images/b4.jpg"></div>
            </div>
            <!-- 如果需要分页器 -->
            <div class="swiper-pagination"></div>
        </div>
    </div>
    <!--------------------------------container---------------------------->
    <div id="container">
        <div>
            <div id="pull-down" class="pull">下拉刷新！</div>
            <ul id="list">
                <li>
                    <div class="content">
                        <div class="good-pic">
                            <a href="javascript:;">
                                <img src="../images/list1.png" alt="">
                            </a>
                        </div>
                        <div class="good-inof">
                            <div class="title">
                                0元大抽奖！走秀携古尔莎为你开启，价值28880元的土耳其特殊待遇
                            </div>
                            <div class="price">
                                <div class="count">
                                    <p>
                                        <span>￥0</span>
                                        <span>￥288880</span>
                                    </p>
                                    <p>0折</p>
                                </div>
                                <div class="car" >
                                    <a href="javascript:;" class="iconfont cart" data-id="1" data-title="甜美兔毛球  加长加厚保暖 不定制" data-price="289" data-src="../images/list1.png" >&#xe653;</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </li>
                <li>
                    <div class="content">
                        <div class="good-pic">
                            <a href="javascript:;">
                                <img src="../images/list1.png" alt="">
                            </a>
                        </div>
                        <div class="good-inof">
                            <div class="title">
                                0元大抽奖！走秀携古尔莎为你开启，价值28880元的土耳其特殊待遇
                            </div>
                            <div class="price">
                                <div class="count">
                                    <p>
                                        <span>￥0</span>
                                        <span>￥288880</span>
                                    </p>
                                    <p>0折</p>
                                </div>
                                <div class="car">
                                    <a href="javascript:;" class="iconfont cart" data-id="2" data-title="甜美兔毛球  加长加厚保暖 不定制" data-price="289" data-src="../images/list1.png">&#xe653;</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </li>
                <li>
                    <div class="content">
                        <div class="good-pic">
                            <a href="javascript:;">
                                <img src="../images/list1.png" alt="">
                            </a>
                        </div>
                        <div class="good-inof">
                            <div class="title">
                                0元大抽奖！走秀携古尔莎为你开启，价值28880元的土耳其特殊待遇
                            </div>
                            <div class="price">
                                <div class="count">
                                    <p>
                                        <span>￥0</span>
                                        <span>￥288880</span>
                                    </p>
                                    <p>0折</p>
                                </div>
                                <div class="car">
                                    <a href="javascript:;" class="iconfont cart" data-id="3" data-title="甜美兔毛球  加长加厚保暖 不定制" data-price="289" data-src="../images/list1.png">&#xe653;</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </li>
                <li>
                    <div class="content">
                        <div class="good-pic">
                            <a href="javascript:;">
                                <img src="../images/list1.png" alt="">
                            </a>
                        </div>
                        <div class="good-inof">
                            <div class="title">
                                0元大抽奖！走秀携古尔莎为你开启，价值28880元的土耳其特殊待遇
                            </div>
                            <div class="price">
                                <div class="count">
                                    <p>
                                        <span>￥0</span>
                                        <span>￥288880</span>
                                    </p>
                                    <p>0折</p>
                                </div>
                                <div class="car">
                                    <a href="javascript:;" class="iconfont cart" data-id="4" data-title="甜美兔毛球  加长加厚保暖 不定制" data-price="289" data-src="../images/list1.png">&#xe653;</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </li>
            </ul>
           <div id="pull-up" class="pull">上拉加载！</div>
        </div>
    </div>
    <!----------------------------footer----------------------------------->
    <footer>
        <ul>
            <li class="active">
                <a href="index.html">
                    <span class=" iconfont">&#xe60e;</span>
                    <strong>首页</strong>
                </a>
            </li>
            <li>
                <a href="search.html">
                    <span class=" iconfont">&#x3553;</span>
                    <strong>分类</strong>
                </a>
            </li>
            <li >
                <a href="shopcar.html">
                    <span class=" iconfont">&#xe653;</span>
                    <strong>购物车</strong>
                </a>
            </li>
            <li>
                <a href="myshow.html">
                    <span class=" iconfont">&#xe603;</span>
                    <strong>我的秀</strong>
                </a>
            </li>
            <li>
                <a href="more.html">
                    <span class=" iconfont">&#xe669;</span>
                    <strong>更多</strong>
                </a>
            </li>
        </ul>
    </footer>
</div>
<script>
    var mySwiper = new Swiper ('.swiper-container', {
        //direction: 'vertical', //默认就是水平
         loop: true,//无限循环
         autoplay: 3000,//自动播放的时间间隔
         autoplayDisableOnInteraction: false,
        // 如果需要分页器
        pagination: '.swiper-pagination',
    })
</script>
</body>
</html>